<%@ page language="java" contentType="text/html; charset=utf-8"
		 pageEncoding="utf-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html lang="zh-cn">
<script>
    var _hmt = _hmt || [];
    (function() {
        var hm = document.createElement("script");
        hm.src = "https://hm.baidu.com/hm.js?3e333071a3344d3aca4055e478d3d968";
        var s = document.getElementsByTagName("script")[0];
        s.parentNode.insertBefore(hm, s);
    })();
</script>
<head>
	<%
		String rootPath = request.getContextPath();
		request.setAttribute("rootPath", rootPath);
	%>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
	<link rel="stylesheet" href="${rootPath}/static/bootstrap/3.3.7/css/bootstrap.css">
	<link rel="stylesheet" href="${rootPath}/static/my/css/style.css">
	<title>征程</title>
</head>
<body>


<nav class=" navbar navbar-default navbar-fixed-top">
	<div class="container">
		<div class="navbar-header">
			<a href="#" class="navbar-brand logo">征程</a>
			<!--缩小的时候显示的下拉按钮-->
			<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-collapse">
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
				<span class="icon-bar"></span>
				<!--按钮显示的东西-->
			</button>
		</div>
		<div class="collapse navbar-collapse" id="navbar-collapse"><!--折叠的时候能缩起来-->
			<ul class="nav navbar-nav navbar-right">
				<li><a href="${rootPath}/index/show"><span class="glyphicon glyphicon-star"></span> 友链</a></li>
				<li class="active"><a href="${rootPath}/video/showfront"><span class="glyphicon glyphicon-film"></span> 视频</a></li>
				<li><a href="${rootPath}/book/showfront"><span class="glyphicon glyphicon-book"></span> 书籍</a></li>
				<li><a href="${rootPath}/to/about"><span class="glyphicon glyphicon-user"></span> 关于</a></li>
				<li><a href="${rootPath}/msg/show"><span class="glyphicon glyphicon-envelope"></span> 留言</a></li>
				<li><a href="${rootPath}/to/login"><span class="glyphicon glyphicon-home"></span> 登录</a></li>
			</ul>
		</div>
	</div>
</nav>

<div class="container topmargin3">
	<form action="${rootPath}/video/search" method="post">
		<p class="margin2">资源来源网络，如有侵权请及时告知，欢迎关注公众号（Java识堂），欢迎加入微信公号群和QQ群（764113208），及时获取优质资源</p>
		<p class="margin2">${notice}</p>
		<input type="text" class="form-control" placeholder="支持视频名和类别搜索" name="name" id="content" value="${content}">
		<input class="btn btn-default margin2" type="submit" value="搜索" data-toggle="modal" data-target="#myModal">
	</form>
	<div class="table-responsive">
		<table class="table table-striped">
			<thead>
			<tr>
				<th>视频名</th>
				<th>作者</th>
				<th>描述</th>
				<th>下载链接</th>
				<th>分类</th>
			</tr>
			</thead>
			<tbody>
				<c:forEach items="${videoList}" var="item" varStatus="status">
					<tr>
						<td>${item.name}</td>
						<td>${item.author}</td>
						<td>${item.description}</td>
						<td><a href="${item.link}">${item.link}</a> </td>
						<td>${item.category}</td>
					</tr>
				</c:forEach>
			</tbody>
		</table>
		<div/>
		总共${pageSum}页&nbsp;&nbsp;&nbsp;&nbsp;
		<c:if test="${pageNum > 1}">
			<input class="btn btn-default" type="button" value="上一页" id="previewpage">
		</c:if>
		第${pageNum}页
		<c:if test="${pageNum < pageSum}">
			<input class="btn btn-default" type="button" value="下一页" id="nextpage">
		</c:if>&nbsp;&nbsp;&nbsp;&nbsp;
		去第<input type="text" size="2" id="jumppage1">页&nbsp;&nbsp;&nbsp;&nbsp;
		<input class="btn btn-default" type="button" value="跳转" id="jumpmatch">
	</div>
	</div>
	<hr>
	<div class="row">
		<div class="col-md-4">
			<p>Java识堂，一个有干货的公众号</p>
			<img src="${rootPath}/static/image/qrcode.jpg" alt="">
		</div>
		<div class="table-responsive col-md-8">
			<table style="border-collapse:separate; border-spacing:10px;">
				<thead>
				<tr>
					<th>最新分享</th>
				</tr>
				</thead>
				<tbody>
				<c:forEach items="${articleList}" var="item" varStatus="status">
					<tr>
						<td><a href="${item.link}">${item.name}</a></td>
					</tr>
				</c:forEach>
				</tbody>
			</table>
			<div/>
		</div>
	</div>
</div>

<footer id="footer">
	<div class="container">
		<a href="${rootPath}/to/state">免责声明</a>
		<a href="http://www.javafxw.com/">源码下载</a>
		<a href="http://www.miitbeian.gov.cn/">晋ICP 备16009776</a>
	</div>
</footer>
<script src="${rootPath}/static/jquery/jquery-3.2.1.min.js"></script>
<script src="${rootPath}/static/bootstrap/3.3.7/js/bootstrap.js"></script>
<script type="text/javascript">
    $("#previewpage").click(function () {
        var content=$("#content").val();
		window.location.href="${rootPath}/video/jump?pageNum=${pageNum-1}&content=" + content;
    })
    $("#nextpage").click(function () {
        var content=$("#content").val();
        window.location.href="${rootPath}/video/jump?pageNum=${pageNum+1}&content=" + content;
    })
    $("#jumpmatch").click(function () {
        val = $("#jumppage1").val();
        if (val >= 1 && val <= ${pageSum}) {
            window.location.href="${rootPath}/video/jump?pageNum="+val;
        }
    })
</script>
</body>
</html>